<script lang="ts" setup>
import { formRule } from './rule'
import type { SysDictionaryType } from '../utils/model'

type Props = {
  data?: SysDictionaryType
}
// 表单Ref

const formRef = ref()
// props
const { data } = defineProps<Props>()
// 表单数据
const formState = ref<SysDictionaryType>({
  name: '',
  code: '',
  status: 1
})

// 判断是否是修改
if (data) {
  Object.assign(formState.value, data)
}
function getRef() {
  return formRef.value
}

defineExpose({ getRef })
</script>

<template>
  <a-form
    ref="formRef"
    :labelCol="{ style: { width: '80px' } }"
    :model="formState"
    :rules="formRule"
    label-align="left"
    style="margin-top: 15px"
  >
    <a-row :gutter="30">
      <a-col :span="24">
        <a-form-item label="字典名称" name="name">
          <a-input v-model:value="formState.name" placeholder="请输入字典名称" />
        </a-form-item>
      </a-col>
      <a-col :span="24">
        <a-form-item label="字典类型" name="code">
          <a-input v-model:value="formState.code" placeholder="请输入字典类型" />
        </a-form-item>
      </a-col>
      <a-col :span="24">
        <SpDict
          v-model="formState.status"
          dictType="sys_dict_status"
          label="状态"
          name="status"
          placeholder="请选择字典状态"
          type="radio"
        />
      </a-col>
      <a-col :span="24">
        <a-form-item label="备注" name="remark">
          <a-textarea v-model:value="formState.remark as string" placeholder="请输入备注" />
        </a-form-item>
      </a-col>
    </a-row>
  </a-form>
</template>

<style scoped></style>
